import React from "react";
import {Card,Button,Icon} from 'antd'
import './ui.less'
import ButtonGroup from "antd/lib/button/button-group";
export default class Buttons extends React.Component {
  state={
    loading:true
  }
  handleCloseLoading=()=>{
    console.log(this)
    this.setState({
      loading:false
    })
  }
  render() {
    return (
        <div className='Home'>
          <Card title='基础按钮'>
            <Button type='primary'>IIIIIIII</Button>
            <Button>IIIIIIII</Button>
            <Button type='dashed'>IIIIIIII</Button>
            <Button type='danger'>IIIIIIII</Button>
            <Button disabled>IIIIIIII</Button>
          </Card>
          <Card title='图形按钮'>
            <Button icon='plus'>创建</Button>
            <Button icon='edit'>编辑</Button>
            <Button icon='delete'>删除</Button>
            <Button shape='circle' icon='search'></Button>
            <Button type='primary' icon='search'>搜索</Button>
            <Button type='primary' icon='download'>下载</Button>
          </Card>
          <Card title='loading按钮'>
            <Button type='primary' loading={this.state.loading}>确定</Button>
            <Button type='primary' shape='circle' loading={this.state.loading}></Button>
            <Button loading={this.state.loading}>点击加载</Button>
            <Button shape='circle' loading={this.state.loading}></Button>
            <Button type='primary' onClick={this.handleCloseLoading}>关闭</Button>
          </Card>
          <Card>
            <ButtonGroup>
              <Button type='primary' icon='left' style={{marginRight:0}}>返回</Button>
              <Button type='primary'>前进<Icon type="right" /></Button>
            </ButtonGroup>
          </Card>
        </div>
    )
  }
}
